<div id="deliveryPlanFormDiv"></div>
<script type="text/html" id="deliveryPlanFormContent">
    <form lay-filter="deliveryPlanForm" id="deliveryPlanForm" class="layui-form model-form open-form "
          style="padding: 5px 30px 0 30px;height: calc(100% - 5px);overflow: hidden;">
        <div class="open-model">
            <div style="height: calc(100% - 100px); padding-top: 20px;overflow: auto;margin-bottom: 20px"
                 class="open-auto">
                <div class="layui-form-item layui-row">
                    <input name="id" type="hidden"/>
                    <div class="layui-inline layui-col-md3">
                        <label class="layui-form-label ">销售类型</label>
                        <div class="layui-input-inline">
                            <select name="salesType" id="salesType" lay-filter="salesType" lay-verify="required"
                                    style="text-align: center;">
                            </select>
                        </div>
                    </div>
                    <div class="layui-inline layui-col-md3">
                        <label class="layui-form-label ">交付时间</label>
                        <div class="layui-input-inline">
                            <input type="text" style="width: 150px" name="sendTime" id="sendTime"
                                   style="text-align: center;"
                                   placeholder="请选择发货时间" autocomplete="off"
                                   class="layui-input setInputDisabled">
                        </div>
                    </div>
                    <div class="layui-inline layui-col-md3">
                        <label class="layui-form-label ">客户</label>
                        <div class="layui-input-inline">
                            <select name="customerId" id="customerId" lay-filter="customerId"
                                    style="text-align: center;"
                                    lay-verify="required"></select>
                        </div>
                    </div>
                    <div class="layui-inline layui-col-md3">
                        <label class="layui-form-label ">销售订单</label>
                        <div class="layui-input-inline">
                            <select name="saleOrderId" id="saleOrderId" lay-filter="saleOrderId"
                                    lay-verify="required"></select>
                        </div>
                    </div>
                    <div class="layui-inline layui-col-md3">
                        <label class="layui-form-label ">客户联系人</label>
                        <div class="layui-input-inline">
                            <input class="layui-input adv-disable" name="contactName" disabled id="contactName"/>
                        </div>
                    </div>
                    <div class="layui-inline layui-col-md3">
                        <label class="layui-form-label ">销售部门</label>
                        <div class="layui-input-inline">
                            <input class="layui-input adv-disable" name="department" id="department" disabled/>
                        </div>
                    </div>
                    <div class="layui-inline layui-col-md3">
                        <label class="layui-form-label ">销售员</label>
                        <div class="layui-input-inline">
                            <input class="layui-input adv-disable" name="salesmanName" id="salesmanName" disabled/>
                        </div>
                    </div>
                    <div class="layui-inline layui-col-md3">
                        <label class="layui-form-label ">订单审核人</label>
                        <div class="layui-input-inline">
                            <select name="approverId" id="approverId" lay-filter="approverId"
                                    lay-verify="required"></select>
                            <!--                            <input class="layui-input" name="approverId" />-->
                        </div>
                    </div>
                </div>
                <button class="layui-btn" type="button" id="ConfigPlan">配置销售产品</button>
                <table class="layui-table" id="deliveryPlanFormTable"
                       lay-filter="deliveryPlanFormTable"></table>
            </div>
        </div>
    </form>

</script>
<script type="text/html" id="deliveryPlanFormTableBar">
    <button class="layui-btn layui-btn-danger layui-btn-xs" type="button" lay-event="del">删除</button>
</script>
<script>
    layui.use(['layer', 'form', 'table', 'admin', 'upload', 'tree', 'laytpl'], async function () {
        var $ = layui.jquery;
        var layer = layui.layer;
        var form = layui.form;
        var table = layui.table;
        var config = layui.config;
        var admin = layui.admin;
        var laydate = layui.laydate;
        var laytpl = layui.laytpl;
        let nowData = {...parentData}
        let data = nowData.data ? nowData.data : {}
        laytpl(deliveryPlanFormContent.innerHTML).render(nowData, function (html) {
            $('#deliveryPlanFormDiv').after(html);
        })
        await admin.getDictListPro('salesType', 'sales_type', '销售类型')
        await admin.initDataSelectPro('user/admin/user/list', {limit: 9999999}, 'approverId', '订单审核人', null, 'username,nickname')
        // await admin.initDataSelectPro('enterprisecab/warehouse/admin/warehouse/getWarehouseVOAll', {}, 'outWarehouseOption', '出货仓库')
        await admin.initDataSelectPro('enterprise/sell/admin/customersInfo/list', {}, 'customerId', '客户', (async d => {
            await admin.initDataSelectPro('enterprise/sell/admin/massOrder/list', {
                customerId: d.value
            }, 'saleOrderId', '销售订单', (async (d, obj) => {
                $('#contactName').val(obj?.customerContactsPhone)
                const userRes = await admin.reqPro('user/admin/user/list', {departmentId: obj.customerId})
                if (userRes.data.length > 0) {
                    const userObj = userRes.data[0]
                    $('#department').val(userObj.departmentName)
                    $('#salesmanName').val(userObj.username)
                }
                table.reload('deliveryPlanFormTable', {data: []})
            }), 'code')

        }), 'customerName')
        laydate.render({
            elem: '#sendTime'
            , type: 'datetime'


        });


        if (data.id) {

        } else {

        }
        table.render({
            elem: '#deliveryPlanFormTable',
            data: [],
            page: false,
            limit: 999999,
            cols: [[
                {type: 'numbers', title: '序号'},
                {field: 'cusProductId', align: 'center', title: '产品编号',width:100},
                {field: 'customerSpecCode', align: 'center', title: '规格号',},
                {field: 'proTypeName', align: 'center', title: '产品类型',},
                {field: 'proUnitName', align: 'center', title: '计价单位',width:100},
                {field: 'offerMoney', align: 'center', title: '产品单价',width:100},
                {field: 'weight', align: 'center', title: '重量(Kg)',width:100},
                {field: 'quantity', align: 'center', title: '订单数量',width:100},
                {
                    field: 'totalMoney',
                    align: 'center',
                    title: '本次发货计划数量',
                    templet: admin.setTableInput('totalMoney')
                },
                {field: 'remark', align: 'center', title: '小计金额', templet: admin.setTableInput('remark')},
                {align: 'center', toolbar: '#deliveryPlanFormTableBar', title: '操作', fixed: 'right'}

            ]],
            done: function () {
                $(".layui-table-body").css('overflow', 'visible');
                $(".layui-table-box").css('overflow', 'visible');
                $(".layui-table-view").css('overflow', 'visible');

            }
        })
        table.on('tool(deliveryPlanFormTable)', function (obj) {
            var data = obj.data;  // 获取当前行的数据
            var layEvent = obj.event;
            // admin.req('sell/admin/orderOffer/list', {})
            if (layEvent == 'del') {
                let list = table.cache['deliveryPlanFormTable'].filter(v => {
                    return v.cusProductId != data.cusProductId
                })
                table.reload('deliveryPlanFormTable', {
                    data: list
                })
            }
        })
        $('#ConfigPlan').click(function () {
            const id = $('#saleOrderId').val()
            if (id) {
                admin.formOpen({
                    area: ['90%', '80%'],
                    offset: '50px',
                    title: '配置订单产品信息',
                    path: 'components/sell/deliveryPlanFormTable.html',
                    success: function () {
                        parentData.id = id
                        parentData.cacheList = [...table.cache['deliveryPlanFormTable']]
                    },
                    end: function () {
                        if (childData.list) {
                            const newData = childData.list || []
                            const oldData = table.cache['deliveryPlanFormTable']
                            const list = newData.map(v => {
                                const obj = oldData.find(v1 => v1.cusProductId === v.cusProductId);
                                if (obj) {
                                    return {...obj};
                                }
                                return v;
                            })
                            table.reload('deliveryPlanFormTable', {
                                data: list  // 设置新的数据
                            });
                        }

                    }
                })
            } else {
                layer.msg('请选择客户销售订单')
            }
        })

    })
</script>
<style>
    /*#deliveryPlanForm .layui-form-label {*/
    /*    width: 100px;*/
    /*}*/

    /*#deliveryPlanForm .layui-form-item .layui-input-inline {*/
    /*    width: 130px;*/
    /*}*/

    #deliveryPlanForm .layui-inline {
        margin-bottom: 10px;
        margin-right: 0px
    }

    /*#deliveryPlanForm .layui-table-cell, .layui-table-tool-panel li {*/
    /*    overflow: visible;*/
    /*}*/
</style>